<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>首页</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="shortcut icon" th:href="@{/favicon.png}" type="image/x-icon">
    <link rel="stylesheet" type="text/css" th:href="@{/res/layui/css/layui.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/res/adminui/dist/css/admin.css}">
    <script type="text/javascript" th:src="@{/res/layui/layui.js}"></script>
    <script type="text/javascript" th:src="@{/res/jquery/jquery.js}"></script>
</head>
<body>
<div class="layui-card">
    <div class="layui-form layui-card-header layuiadmin-card-header-auto">
        <div class="layui-form-item">
            <!--  滴滴答答  -->
        </div>
        <div class="layui-form-item">
            <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" id="addBtn"
                    onclick="openDialog()">新增
            </button>
            <button class="layui-btn layui-btn-primary layui-btn-sm" lay-submit lay-filter="searchUserRole"
                    id="searchUserRole">
                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
        </div>
    </div>
    <div class="layui-card-body">
        <table id="userRoleTable" lay-filter="userRoleTable"></table>
        <script type="text/html" id="userRoleToolBar">
<!--            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="pause">停</a>-->
<!--            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="resume">恢</a>-->
            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="run">执</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删</a>
        </script>
    </div>
</div>
<script type="text/html" id="switchTpl">
    <input type="checkbox" value="{{d.status}}" lay-skin="switch" lay-text="ON|OFF" {{ d.status === '1' ? 'checked' : '' }}>
</script>
<script type="text/javascript" th:inline="javascript">
    const contextPath = [[${#httpServletRequest.getContextPath()}]];
</script>
<script type="text/javascript">
    layui.use(['form', 'table'], function () {
        const form = layui.form
            , table = layui.table;
        table.render({
            elem: '#userRoleTable',
            method: 'get',
            url: contextPath + '/quartz/getList',
            cols: [ [
                {field: 'serialNumber', align: 'center', title: '序号', type: 'numbers'},
                {field: 'jobGroup', width: 120, align: 'center', title: '组'},
                {field: 'jobName', width: 120, align: 'center', title: '名称', templet: function (d) {
                    return '<div style="cursor:pointer;color:#01AAED">'+d.jobName+'</div>'
                    }},
                {field: 'invokeTarget', align: 'center', title: 'invokeTarget'},
                {field: 'cronExpression', align: 'center', title: 'cron'},
                {field: 'concurrency', width: 120, align: 'center', title: '并发'},
                {field: 'status', width: 120, align: 'center', title: '状态', templet: '#switchTpl'},
                {field: 'remark', align: 'center', title: '备注'},
                {title: '操作', width: 150, align: 'center', toolbar: '#userRoleToolBar'}
            ] ],
            page: true,
            id: 'userRoleTable',
        });
        //监听工具条
        table.on('tool(userRoleTable)', function (obj) {
            if (obj.event === 'del') {
                del(obj.data)
            } else if (obj.event === 'edit') {
                openDialog()
            } else if (obj.event === 'run') {
                run(obj.data)
            }
        });
        //监听搜索
        form.on('submit(searchUserRole)', function (data) {
            const field = data.field;
            table.reload('userRoleTable', {
                where: field
            });
        });
    });

    /**
     * 新增||修改 弹窗
     * */
    function openDialog() {
        layer.open({
            type: 2,
            shade: 0.5,
            title: '新增',
            area: ['550px', '500px'],
            content: contextPath + '/quartz/add',
            // btn: ['提交', '关闭'],
        })
    }
    /**
     * 搜索
     * */
    function run(data) {
        $.ajax({
            type: 'post',
            url: contextPath + '/quartz/run',
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                'jobGroup': data.jobGroup,
                'jobId': data.jobId
            }),
            datatype: "json",
            success: function (data) {
                if (data.code === 1) {
                    layer.msg(data.msg);
                    setTimeout(function () {
                        close()
                    }, 3000)
                } else {
                    console.log(data);
                    layer.msg(data.msg);
                }
            }
        });
    }
    /**
     * 删除
     * */
    function del(data) {
        layer.confirm('确认删除？', function (index) {
            $.ajax({
                type: "post",
                url: contextPath + '/quartz/del/',
                contentType: "application/json;charset=UTF-8",
                data: JSON.stringify({
                    'jobGroup': data.jobGroup,
                    'jobId': data.jobId
                }),
                datatype: "json",
                success: function (data) {
                    if (data.code === "1") {
                        layer.msg(data.msg);
                        layer.close(index);
                    } else {
                        layer.msg('删除失败！');
                    }
                }
            });
        });
    }
    /**
     * 搜索
     * */
    function search() {
        $("#searchUserRole").click()
    }
</script>
</body>
</html>